<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>注册</title>
    <link rel="stylesheet" type="text/css" href="iconfont/iconfont.css">
    <link rel="stylesheet" type="text/css" href="css/nanhang.css">
    <link rel="stylesheet" type="text/css" href="css/register.css"/>
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <script type="text/javascript" src="IIInsomniaCityPicker/js/jquery.cookie.js"></script>

    <script src="js/top.js"></script>
    <script src="js/nanhang.js"></script>
    <script src="js/pinyin.js"></script>
<style>
    #getPhone{padding-left: 0px}
</style>

</head>
<body>

<div class="middle"></div>
<div class="content">
    <div class="ct_a">
        <div class="left">
            <div><p>快速入会，即可领取机票优惠劵!</p></div>
            <div>
                <div class="nr">
                    <p class="nr_1">
                        <span style="color:red">*</span>中文姓
                        <input type="text" id="xing" placeholder="生僻字可用拼音代替"/>
                        <span class="nr_11">姓氏拼音</span>
                        <input class="nr_12" type="text" id="xing2"
                               placeholder="中文姓的拼音,您可以自己修改"/>
                    </p>
                    <p class="nr_1">
                        <span style="color:red">*</span>中文名
                        <input type="text" id="ming" placeholder="生僻字可用拼音代替"/>
                        <span class="nr_11">名字拼音</span>
                        <input class="nr_12" type="text" id="ming2" placeholder="中文名的拼音,您可以自己修改"/>
                    </p>

                    <p class="nr_1">
                        <span style="color:red">*</span>证件类型
                        <select name="" id="zjlx">
                            <option value="1" selected>身份证</option>
                            <option value="2">护照</option>
                            <option value="3">其他</option>
                        </select>
                        <span class="nr_11">证件号码</span>
                        <input class="nr_12" type="text" id="zhengjian" placeholder="请输入证件号"/>
                    </p>
                    <p class="nr_1">
                        <span style="color:red">*</span>生日
                        <input type="text" id="birth" disabled value=""/>
                        <span class="xh" style="color:red">*</span>性别
                        <span class="mel">
                                    <label><input class="sex" type="radio" value="" id="man" disabled name="sex"/>男</label>
                                    <label><input class="sex" type="radio" value="" id="woman" disabled name="sex"/>女</label>
                                </span>
                    </p>

                    <p class="nr_1">
                        <span style="color:red">*</span>手机号码
                        <select name="" id="sjhm">
                            <option value="1" selected>中国(86)</option>
                            <option value="2">中国香港(852)</option>
                            <option value="3">中国澳门(853)</option>
                        </select>
                        <input class="nr_13" type="text" id="phone" placeholder="可以联系到您的国内、国际手机"/>
                    </p>
                    <div class="nr_1">
                        <div class="sms">
                                <span style="color:red">*</span>短信验证码
                                <input type="text" id="yanzhengma" placeholder="请输入手机验证码"/>
                                <input class="nr_13" id="btn-getPhone" onclick="getPhone()"value="获取手机验证码" type="button">
                        </div>
                        <span  id="showTrue" style="color: red; margin-left:5px; float:left;"></span>
                    </div>
                    <p class="nr_1">
                        <span style="color:red">*</span>邮箱
                        <input class="yx" type="text" id="email" placeholder="请输入邮箱"/>
                    </p>
                </div>
                <div>
                    <label>
                        <input class="tk" type="checkbox" id="check1"/>我已阅读并同意明珠会员服务条款
                        <a href="">明珠会员条款</a>
                    </label>
                </div>
                <p class="wyrh" onclick="REGISTER.reg() " id="register">我要入会</p>
            </div>
            <div class="wxts">
                温馨提示:
                <p>如使用外国人永久居留身份证，请选择“其他”证件进行入会。</p>
            </div>
        </div>
        <div class="right">

        </div>

    </div>
</div>
<footer>
    <div class="footerL">Copyright(C)1997-2017 中国南方航空股份有限公司 版权所有 粤ICP备05053330号</div>
    <div class="footerR">
        <a href="">关于南航｜</a>
        <a href=""> 投资者关系｜</a>
        <a href=""> 预订须知 ｜</a>
        <a href=""> 常见问题 ｜</a>
        <a href=""> 联系我们｜ </a>
        <a href=""> "十分"关爱基金会</a>
    </div>
    <div class="clear"></div>
</footer>


<script type="text/javascript">





    var REGISTER = {

        inputcheck: function () {
            //不能为空检查
            if ($("#xing").val() == "") {
                alert("中文姓不能为空");
                $("#xing").focus();
                return false;
            }
            if ($("#ming").val() == "") {
                alert("中文名不能为空");
                $("#ming").focus();
                return false;
            }
            if ($("#zhengjian").val() == "") {
                alert("证件号码不能为空");
                $("#ming").focus();
                return false;
            }
            if ($("#email").val() == "") {
                alert("邮箱不能为空");
                $("#ming").focus();
                return false;
            }
            if ($("#pwd").val() == "") {
                alert("密码不能为空");
                $("#pwd").focus();
                return false;
            }
            if ($("#phone").val() == "") {
                alert("手机号不能为空");
                $("#phone").focus();
                return false;
            }


            return true;
        },
        beforeSubmit: function () {
            //检查用户是否已经被占用

            $.ajax({
                url: "/user/checkphone",
                type: "post",

                data: {'phone': $("#phone").val(),},
                datatype: "json",
                success: function (data) {
                    if (data.status == 400) {
                        alert("手机号已被注册！")
                    } else {
                        REGISTER.get();
                    }


                }
            });

        },
        get: function (){

        var phone = document.getElementById("phone").value;
            alert(phone);
            var timer=null;
            var sec=60;
            $('#btn-getPhone').attr('disabled','disabled');
            timer=setInterval(function(){
                sec--;
                $('#btn-getPhone').val('验证码已发送('+sec+')秒后重新获取');
                if(sec==0){
                    clearInterval(timer);
                    $('#btn-getPhone').val('获取手机验证码');
                    $('#btn-getPhone').removeAttr('disabled');
                }
            },1000);

            $.ajax({
                url:"/order/smsVerify",
                type:"post",
                dataType:"json",
                data:{
                    "phone":phone
                },
                success:function(data){
                    dataPhone =data;
                }
            });

       },

        yanzhengma: function () {
            var name = $("#xing").val() + $("#ming").val();

            $.ajax({
                url: "/user/register",
                type: "post",

                data: {
                    'name': name,
                    'phone': $("#phone").val(),
                    'email': $("#email").val(),


                },
                datatype: "json",
                success: function (data) {
                    if (data.status == 200) {
                        alert("注册成功");

                    }else{
                        alert("用户名密码错误");
                    }


                }
            });

        },
        doSubmit: function () {
            var name = $("#xing").val() + $("#ming").val();

            $.ajax({
                url: "/user/register",
                type: "post",

                data: {
                    'name': name,
                    'phone': $("#phone").val(),
                    'email': $("#email").val(),


                },
                datatype: "json",
                success: function (data) {
                    if (data.status == 200) {
                        alert("注册成功")

                    }


                }
            });

        },

        reg: function () {
            if (this.inputcheck()) {
                this.doSubmit();
            }
        },

    };


    //手机验证码

    var dataPhone;
    function getPhone() {
        if ($("#phone").val() == "") {
            alert("手机号不能为空");
            $("#phone").focus();
            return false;

        }
        if (!$("#phone").val() == "") {
            REGISTER.beforeSubmit();

        }
    }




    $('#yanzhengma').blur(function yanzhengma(){
            var getyanzhengma = $("#yanzhengma").val();
            alert(getyanzhengma);
            $.ajax({
                url:"/order/smsVerifyJudge",
                type:"post",
                dataType:"json",
                data:{
                    "getyanzhengma":getyanzhengma,
                    "dataPhone":dataPhone
                },
                success:function(data){
                    var dataType = data;
                    if(dataType==1){
                        $('#showTrue').text("验证码正确");
                    }else{
                        $('#showTrue').text("验证码错误");
                    }
                }
            });

        }
    );


    //中文转换成拼音
    $('#xing').blur(function () {
        var zs = $(this).val();
        var c = ConvertPinyin(zs);
        console.log(c);
        c = c.toUpperCase();
        document.getElementById('xing2').value = c;

    });
    $('#ming').blur(function () {
        var m = $(this).val();
        var mm = ConvertPinyin(m);
//        mm=mm.toUpperCase();
        document.getElementById('ming2').value = mm;
    });


    $('#zhengjian').blur(function () {
        var idCard = $('#zhengjian').val();
        var birthday = "";

        if (idCard != null && idCard != "") {
            if (idCard.length == 15) {
                birthday = "19" + idCard.substr(6, 6);
              if (idCard[14]%2==0){
                  document.getElementById("woman").checked = "checked";
              }else{
                  document.getElementById("man").checked = "checked";

              }
            } else if (idCard.length == 18) {
                birthday = idCard.substr(6, 8);
                if(idCard[16]%2==0){
                    document.getElementById("woman").checked = "checked";
                }else{
                    document.getElementById("man").checked = "checked";
                }
            }

            birthday = birthday.replace(/(.{4})(.{2})/, "$1-$2-");
            console.log(birthday);
            document.getElementById('birth').value = birthday;
        }
    });
</script>


</body>
</html>